<template>
    <el-select v-model="props.departmentId" placeholder="请选择科室" clearable>
        <el-option v-for="department in departments" :key="department.id" :label="department.name"
            :value="department.id" />
    </el-select>
</template>

<script lang="ts" setup>
import { computed, onMounted, ref } from 'vue'
import { GetDepartments } from '@/api/DepartmentService'

// Props 定义
const props = defineProps({
    departmentId: {
        type: [Number, String],
        default: null
    }
})

// 事件定义
const emit = defineEmits(['update:departmentId'])

// 获取科室数据
const departments = ref()
onMounted(async () => {
    const response = await GetDepartments()
    departments.value = response.data
})

// 核心修改：使用计算属性实现双向绑定
// const selectedId = computed({
//     get: () => props.departmentId,
//     set: (value) => emit('update:departmentId', value)
// })

emit('update:departmentId', props.departmentId)
</script>